<template>
    <Card>
        <Row>
            <Tabs @on-click="changeTab" :value="tabName" type="card" :animated="false">
                <TabPane icon="ios-flower" name="index-system"  label="批量程序配置">
                    <BatchConfig ref="batchConfig"  @changeTab="changeTab"></BatchConfig>
                </TabPane>
                <TabPane icon="ios-at" v-if="$store.getters.permissions['afs-batch-config']" name="index-job"  label="批量组配置">
                    <BatchJobConfig></BatchJobConfig>
                </TabPane>
                <TabPane icon="ios-ionitron"  v-if="$store.getters.permissions['afs-batch-config']" name="index-step"  label="批量步骤配置">
                    <BatchJobStepConfig></BatchJobStepConfig>
                </TabPane>
                <TabPane icon="md-outlet" name="index-monitor"  label="实时日志">
                    <Monitor></Monitor>
                </TabPane>
                <TabPane icon="md-help-buoy" name="index-runLog"  label="执行记录">
                    <StepLog></StepLog>
                </TabPane>
            </Tabs>
        </Row>
    </Card>
</template>
<script>
import BatchConfig from './components/batch-config'
import BatchJobConfig from './components/batch-job-config'
import BatchJobStepConfig from './components/batch-job-step-config'
import Monitor from './components/monitor-info'
import StepLog from './components/batch-job-step-logs'
export default {
    components:{
        BatchConfig:BatchConfig,
        BatchJobConfig:BatchJobConfig,
        BatchJobStepConfig:BatchJobStepConfig,
        Monitor:Monitor,
        StepLog:StepLog
    },
    data(){
        return {
            tabName:'index-system'
        }
    },
    methods:{
        changeTab(name){
            this.tabName = name;
            if(name==='index-system'){
                this.$refs['batchConfig'].refreshBatchInfo();
            }
        }
    }
}
</script>
